<!DOCTYPE html>
<html>

<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<title>Untitled 1</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>
<style type="text/css">
.mainTextArea {
	width: 800px;
	height: 600px;
	background-color: white;
}
body {
	background-color:gray;
}
</style>
</head>

<body>
<div class="mainTextArea" id="mainTextArea" contenteditable="true">
<p>
Click somewhere in this paragraph and type something.
</p>
<p>
This is the second paragraph.
</p>
</div>

<script type="text/javascript">

function keydown_function(event)
{
	alert("keydown");
}

function keypress_function(event)
{
    alert("keypress");
}

$("#mainTextArea").keydown(keydown_function);
$("#mainTextArea").keypress(keypress_function);

</script>
</body>

</html>
